<template>
	<div>
		<el-container>
			<el-header>
				<img src="/src//assets/index/20211311802.jpg"/>
				<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
					background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
					<el-menu-item index="1" @click="index">首页</el-menu-item>
					<el-menu-item index="2" @click="findAllEquip">设备信息</el-menu-item>
					<el-menu-item index="3" @click="findByExample">分类查询</el-menu-item>
					<el-menu-item index="4" @click="notice">公告信息</el-menu-item>
					<el-menu-item index="5" @click="personalEquipments">我的设备</el-menu-item>
					<el-menu-item index="6" >订单管理</el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>
					<el-menu-item></el-menu-item>

					<el-menu-item index="11">用户头像地址{{userimage}}</el-menu-item>
					<el-menu-item index="12">用户名称{{username}}</el-menu-item>
					<el-menu-item index="13">用户登录状态{{isLogin}}</el-menu-item>
					<el-menu-item></el-menu-item>
					<el-button @click="toLogin">点击登录</el-button>
				</el-menu>

			</el-header>

			<el-container>
				<el-main>
					<router-view></router-view>
				</el-main>

			</el-container>
		</el-container>
	</div>

</template>

<script>
	export default {
		data() {
			return {
				activeIndex: '1',
				userimage: '',
				username: '',
				isLogin: false,

			}
		},
		methods: {
			handleSelect(key, keyPath) {
				// console.log(key, keyPath);
			},
			toLogin: function() {
				this.$router.push('/userloginandregist')
			},
			index: function() {
				this.$router.push('index')
			},
			findAllEquip: function() {
				this.$router.push('equip')
			},
			findByExample: function() {
				this.$router.push('findByExample')
			},
			notice: function() {
				this.$router.push('notice')
			},
			personalEquipments:function(){
				this.$router.push('pequip')
			}
			
		},
		mounted() {
			let arr = document.cookie.split('; ')
			console.log(arr)
			var t = this.$cookies.get("token")
			if (t != null && t != "") {
				this.isLogin = true
				this.username = this.$cookies.get("username")
				this.userimage = this.$cookies.get("userimage")
			}


		}

	}
</script>

<style>
	.el-container {
		height: 100%;
	}

	.el-header,
	.el-footer {
		background-color: #B3C0D1;
		color: #333;
		text-align: center;
		line-height: 60px;
	}

	.el-main {
		background-color: #00ffff;
		color: #333;
		text-align: center;
		line-height: 60px;
	}
</style>